<template>
  <div class="appButton">
    <el-button type="primary" plain size='small' style="margin-left:10px" @click="appDialogVisible" class="adduse">{{$t('添加应用')}}</el-button>
    <el-dialog :close-on-click-modal='false' v-drag :title="$t(title)" append-to-body :v-if="dialogVisible" :visible.sync="dialogVisible" width="600px">
      <!-- 添加页面 -->
      <AppEdit ref="child_form" v-bind:type_info="type_info" @childForm="handleChildForm" :policyType='policyType' />

      <!-- 弹窗控件 -->
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="getChildData" class="addSubmitApp">{{$t('确 定')}}</el-button>
        <el-button @click="closeDialog" class="addCloseApp">{{$t('取 消')}}</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import { addAppData } from '@/api/list/app'
import AppEdit from '@/pages/List/app/components/AppEdit'
export default {
  name: 'AppDialog',
  props: ['nameType', 'policyType'],
  components: {
    AppEdit
  },
  data () {
    return {
      dialogVisible: false,
      title: '添加应用',
      type_info: '添加'
    }
  },
  methods: {
    appDialogVisible () {
      this.dialogVisible = true
      this.$nextTick(() => {
        this.$refs.child_form.initType()
      })
    },
    getChildData () {
      this.$refs.child_form.send_form()
    },
    handleChildForm (data) {
      addAppData(data).then(res => {
        if (res.status === 0) {
          this.$messages.success(this.$t('添加成功'))
          this.$emit('appDataList', data, data.app_type)
          this.closeDialog()
        }
      })
    },
    closeDialog () {
      this.dialogVisible = false
      this.$refs.child_form.close()
    }
  }
}
</script>
<style lang="scss" scoped>
.appButton {
  display: inline;
}
</style>
